<html>
    <head>
        <link rel="stylesheet"  href="hud.css" />
    </head>
    <body>
        <h1>edit.html</h1>

        <div id="log" style="border: solid black 1px;">
        </div>

        <script>
            function log(text) {
              var t = document.createTextNode(text);
              var n = document.createElement("div");
              n.appendChild(t)

              document.getElementById("log").appendChild(n);
            }

            var do_reload = function() {
              log("**reload**");
              window.HUD.reloadMainFrame();
            };

            var do_modify = function() {
              log("**modify**");
              var dom = window.HUD.mainFrameDOM();
              log("Got DOM:" + dom);

              e = dom.getElementById("foo");
              log("Got Element:" + e);


							e.innerHTML = "Hello, world!";
            }

            log("Loaded ...");

            log("mainFrameDOM:" + window.HUD.mainFrameDOM() );
        </script>


        <div class="button" onClick="do_reload();">
          RELOAD Main Frame
        </div>

        <div class="button" onClick="do_modify();">
          Modify Main Frame DOM
        </div>


    </body>
</html>
